import { queryCompanies } from '@/pages/SystemUser/service';
import { Role } from '@/utils/types.d';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import type { ProColumns } from '@ant-design/pro-components';
import { ProTable } from '@ant-design/pro-components';
import { useModel } from 'umi';
import { queryTollerOperRecords } from '../service';
import type { TollerOperRecordTableItem } from '../types';

export default () => {
  const { initialState } = useModel('@@initialState');
  const currRole = initialState?.currentUser?.role;
  const columns: ProColumns<TollerOperRecordTableItem>[] = [
    {
      title: 'id',
      hideInTable: true,
      hideInSearch: true,
      dataIndex: '_id',
    },
    {
      title: '所属用户',
      dataIndex: 'ownerId',
      hideInForm: true,
      hideInTable: currRole !== Role.ADMIN,
      hideInSearch: currRole !== Role.ADMIN,
      fieldProps: { showSearch: true },
      debounceTime: 300,
      request: (val) => queryCompanies(val.keyWords),
      width: 150,
    },
    {
      title: '员工编号',
      align: 'center',
      dataIndex: 'jobNo',
    },
    {
      title: '员工姓名',
      align: 'center',
      dataIndex: 'userName',
    },
    {
      title: 'IP地址',
      hideInSearch: true,
      align: 'center',
      dataIndex: 'ip',
    },
    {
      title: '操作类型',
      align: 'center',
      dataIndex: 'operType',
      valueEnum: {
        create: { text: '添加' },
        delete: { text: '删除' },
        modify: { text: '修改' },
        query: { text: '查询' },
        login: { text: '登录' },
        export: { text: '导出' },
        import: { text: '导入' },
        charge: { text: '收费' },
        print_ticket: { text: '打印小票' },
      },
    },
    {
      title: '目标类型',
      hideInSearch: true,
      align: 'center',
      dataIndex: 'targetType',
    },
    {
      title: '操作时间',
      align: 'center',
      dataIndex: 'operTime',
      valueType: 'dateTime',
      hideInSearch: true,
    },
    {
      title: '操作描述',
      hideInSearch: true,
      ellipsis: true,
      dataIndex: 'description',
    },
  ];
  return (
    <PageHeaderWrapper
      header={{
        title: '',
        subTitle: 'POS操作日志',
        breadcrumb: {
          routes: [
            {
              path: '/',
              breadcrumbName: '首页',
            },
            {
              path: '/staff',
              breadcrumbName: '员工管理',
            },
            {
              path: '/staff/oper-record',
              breadcrumbName: '操作日志',
            },
          ],
        },
      }}
    >
      <ProTable<TollerOperRecordTableItem>
        columns={columns}
        rowKey="_id"
        style={{ whiteSpace: 'nowrap' }}
        scroll={{ x: true }}
        search={{
          labelWidth: 'auto',
        }}
        columnEmptyText="暂无数据"
        debounceTime={300}
        request={async (param, sort) => {
          const res = await queryTollerOperRecords(param, sort);
          return res;
        }}
        dateFormatter="string"
        pagination={{
          showSizeChanger: true,
          showQuickJumper: true,
          defaultPageSize: 10,
          size: 'default',
        }}
      />
    </PageHeaderWrapper>
  );
};
